<!DOCTYPE html>
<html>
<head>
    <title>欢迎使用后台管理系统</title>
    <meta charset="utf-8">
    <%- include ../default.html%>
    <link href="/public/css/main.css" rel="stylesheet" type="text/css"/>
    <link href="/public/css/user-manage.css" rel="stylesheet" type="text/css"/>
</head>

<body>
    <%- include header.html%>
    <section>
        <%- include menu.html%>
        <aside class="content" id="content">
            <el-form :inline="false" v-model="formModel" class="demo-form-inline api-user query-api">
                <el-row :gutter="2">
                    <el-col :sm="8" :md="6" :lg="6">
                        <el-form-item label="标签分类">
                            <el-select v-model="formModel.classify" placeholder="标签分类" size="mini">
                                <el-option label="不限" value=""></el-option>
                                <el-option v-for="(vo,index) in tagClassify" :label="vo.tagName" :value="vo.id" :key="index"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :sm="8" :md="6" :lg="6">
                        <el-form-item label="标签名称" class="max254">
                            <el-input v-model="formModel.tagName" placeholder="标签名称" size="mini" ref="tagName"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col  :sm="8" :md="8" :lg="8">
                        <el-form-item>
                            <el-button type="primary" @click="searchList" size="mini" style="padding:7px 10px;" icon="el-icon-search">查询</el-button>
                            <el-button type="danger" @click="batchDelete" size="mini" style="padding:7px 10px;" icon="el-icon-circle-close-outline">批量删除</el-button>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <template>
                <el-table :data="tableData" style="width: 100%" size="mini" class="aa-table" @select="selectRow" @select-all="selectAll" ref="list">
                    <el-table-column fixed type="selection" label="" width="50"></el-table-column>
                    <el-table-column fixed type="index" label="序号" width="50"></el-table-column>
                    <el-table-column fixed prop="parentName" label="标签分类" width="250"></el-table-column>
                    <el-table-column fixed prop="tagName" label="标签名称" width="250"></el-table-column>
                    <el-table-column fixed prop="memo" label="备注信息"></el-table-column>
                    <el-table-column fixed prop="operate" label="操作" :render-header="renderHeader" width="180" align="center">
                        <template slot-scope="scope">
                                <el-button size="mini" @click="editTagHandler(scope.row)">编辑</el-button>
                                <el-button size="mini" type="danger" @click="deleteTagHandler(scope.row)">删除</el-button>
                            </template>
                    </el-table-column>
                </el-table>
                <div class="block repeat-menu-page">
                        <el-pagination  background
                        :current-page="page.currentPage"
                        :page-sizes="page.pageSizes"
                        :page-size="page.pageSize"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="page.total"
                        @size-change="sizeChangeHandler"
                        @current-change="currentChangeHandler"></el-pagination>
                </div>
            </template>
            <!-- 新增标签 修改标签 -->
            <el-dialog :title="dialogTile" :visible.sync="dialogMenWinVisible"  custom-class="add-dialog" width="50%" :close-on-click-modal="false" v-cloak @close="closeDialog('newTag')">
                    <el-form :label-position="'left'" label-width="80px" ref="newTag" :model="newTag" size="mini" :rules="rules" :show-message="true" :status-icon="true" class="demo-form-inline api-user">
                        <el-row :gutter="10">
                            <el-col :sm="12" :md="12" :lg="6">
                                <el-form-item label="类别" prop="level">
                                    <el-select v-model="newTag.level" placeholder="标签类别" size="mini" :disabled="newTag.levelDisable">
                                        <el-option  label="标签分类" value="0"></el-option>
                                        <el-option  label="标签" value="1"></el-option>
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :sm="12" :md="12" :lg="6" v-if="newTag.level=='0'">
                                <el-form-item label="分类名称" prop="tagName">
                                    <el-input v-model="newTag.tagName" placeholder="标签名称" size="mini"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :sm="12" :md="12" :lg="6" v-if="newTag.level=='1'">
                                <el-form-item label="分类名称" prop="classify">
                                    <el-select v-model="newTag.classify" placeholder="分类名称" size="mini">
                                        <el-option v-for="(vo,index) in tagClassify" :label="vo.tagName" :value="vo.id"  :key="index"></el-option>
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :sm="12" :md="12" :lg="6" v-if="newTag.level=='1'">
                                <el-form-item label="标签名称" prop="tagName">
                                    <el-input v-model="newTag.tagName" placeholder="标签名称" size="mini"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :sm="24">
                                <el-form-item label="描述" prop="memo">
                                    <el-input type="textarea" v-model="newTag.memo"></el-input>
                                </el-form-item>
                            </el-col>                                  
                        </el-row>
                    </el-form>
                    <div slot="footer" class="dialog-footer">
                        <el-button @click="closeDialog('newTag')">取消</el-button>
                        <el-button type="primary" @click="submitDialog('newTag')">确定</el-button>
                    </div>
            </el-dialog>
            <!--删除的提示信息-->
            <el-dialog title="提示信息" :visible.sync="confirmVisible" width="30%"  custom-class="api-dialog-tips" v-cloak>
                <span>此操作将永久删除该记录，是否继续？</span>
                <span slot="footer" class="dialog-footer">
                    <el-button size="mini" @click="cancelHandler">取 消</el-button>
                    <el-button type="primary" @click="deleteHandler" size="mini">确 定</el-button>
                </span>
            </el-dialog>
        </aside>
    </section>
</body>
</html>
<script src="/public/js/main.js"> </script>
<script src="/public/js/tagManage.js"></script>